<template>
  <div class="app-container">
    <!-- 添加或修改参数配置对话框 -->
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="企业全称" prop="name">
              <el-input v-model="form.name" placeholder="请输入企业全称" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="信用代码" prop="legalCode">
              <el-input v-model="form.legalCode" placeholder="信用代码" />
            </el-form-item>
          </el-col>          
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="法人代表" prop="legalName">
              <el-input v-model="form.legalName" placeholder="请输入法人代表" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="成立时间" prop="bornDay">
              <el-date-picker clearable v-model="form.bornDay" type="date" value-format="timestamp" placeholder="选择成立时间" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="16">
            <el-form-item label="注册地址" prop="address">
            <el-input v-model="form.address" placeholder="请输入注册地址" />
          </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="16">
            <el-form-item label="基地介绍" prop="farmInfo">
              <el-input v-model="form.farmInfo" type="textarea" placeholder="基地介绍（100-250字）" maxlength="11" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="联系人" prop="linkName">
              <el-input v-model="form.linkName" placeholder="请输入联系人名称" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="联系手机" prop="linkTel">
              <el-input v-model="form.linkTel" placeholder="请输入手机号码" maxlength="11" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" v-hasPermi="['agri:company:create']" @click="submitForm">保 存</el-button>
        <!-- <el-button @click="cancel">重置</el-button> -->
      </div>      
  </div>
</template>

<script>

import { getMyCompany, updateMyCompany } from "@/api/agri/company";

export default {
  name: "AgriCompany",
  data() {
    return {
      // 遮罩层
      loading: true,      
      // 表单参数
      form: {
        id: undefined,
        legalName: undefined,
        legalIdcard: undefined,
        legalPic: undefined,
        capital: undefined,
        bornDay: undefined,
        address: undefined,
        business: undefined,
        remark: undefined,
        auditStatus: undefined,
        supply: undefined,
        name: undefined,
        bizType: undefined,
        status: undefined,
        type: undefined,
        linkName: undefined,
        linkTel: undefined,
        legalCode: undefined,
        farmInfo: undefined,
      },
      //默认表单数据
      defaultForm: null,
      // 表单校验
      rules: {
        name: [
          { required: true, message: "不能为空", trigger: "blur" }
        ],
        legalCode: [
          { required: true, message: "不能为空", trigger: "blur" }
        ],
        address: [
          { required: true, message: "不能为空", trigger: "blur" }
        ],
        farmInfo: [
          { required: true, message: "不能为空", trigger: "blur" }
        ],
        linkName: [
          { required: true, message: "不能为空", trigger: "blur" }
        ],
        linkTel: [
          {
            required: true, 
            pattern: /^(?:(?:\+|00)86)?1(?:3[\d]|4[5-79]|5[0-35-9]|6[5-7]|7[0-8]|8[\d]|9[189])\d{8}$/,
            message: "请输入正确的手机号码",
            trigger: "blur"
          }
        ]
      },
    };
  },
  watch: {
    // 根据名称筛选部门树
    defaultForm(val) {
      console.log("defaultForm",val);
    }
  },
  created() {    
    this.defaultForm = this.form;
    this.getCompany();
  },
  methods: {    
    /** 查询用户列表 */
    getCompany() {
      this.loading = true;
      getMyCompany().then(response => {
        console.log("getMyCompany",response);
        if(response.code === 0 && response.data !== null){
        this.form = response.data;
        this.defaultForm = response.data
        }
      });
    },
    
    // 取消按钮
    cancel() {
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = this.defaultForm;
      console.log("this.form",this.form);
    },
    
    /** 提交按钮 */
    submitForm: function() {      
      this.$refs["form"].validate(valid => {
        console.log(this.form);
        if (!valid) {
          return;
        }
        // 修改的提交
        updateMyCompany(this.form).then(response => {
          if(response.code === 0)
            this.$modal.msgSuccess("保存成功");
          else
            this.$modal.msgError(response.msg)
        }); 

      });
    },
    // 文件上传中处理
    handleFileUploadProgress(event, file, fileList) {
      this.upload.isUploading = true;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
      if (response.code !== 0) {
        this.$modal.msgError(response.msg)
        return;
      }
      this.upload.open = false;
      this.upload.isUploading = false;
      this.$refs.upload.clearFiles();
      // 拼接提示语
      let data = response.data;
      let text = '创建成功数量：' + data.createUsernames.length;
      for (const username of data.createUsernames) {
        text += '<br />&nbsp;&nbsp;&nbsp;&nbsp;' + username;
      }
      text += '<br />更新成功数量：' + data.updateUsernames.length;
      for (const username of data.updateUsernames) {
        text += '<br />&nbsp;&nbsp;&nbsp;&nbsp;' + username;
      }
      text += '<br />更新失败数量：' + Object.keys(data.failureUsernames).length;
      for (const username in data.failureUsernames) {
        text += '<br />&nbsp;&nbsp;&nbsp;&nbsp;' + username + '：' + data.failureUsernames[username];
      }
      this.$alert(text, "导入结果", { dangerouslyUseHTMLString: true });
      this.getList();
    },
    // 提交上传文件
    submitFileForm() {
      this.$refs.upload.submit();
    },
  }
};
</script>
